import React from 'react'
import { connect } from 'react-redux'
import action from './store/actions/home'
import { useMount } from 'ahooks'
function App(props) {
  useMount(() => {
    props.getBannerList()
    props.getProList()
  })
  return (
    <div>
      {
        props.bannerList.map(item => {
          return <img src={item.img} alt={item.alt} key={item.bannerid} />
        })
      }
      {
        props.proList.map(item => {
          return <div key={item.proid} >{ item.proname }</div>
        })
      }
    </div>
  )
}

export default connect(state => {
  return {
    bannerList: state.getIn(['home', 'bannerList']),
    proList: state.getIn(['home', 'proList'])
  }
}, (dispatch) => {
  return {
    getBannerList () {
      dispatch(action.getBannerListAction)
    },
    getProList () {
      dispatch(action.getProListAction())
    }
  }
})(App)
